<template>
    <div class="search-container">
        <el-row :gutter="20">
            <el-col :span="6" :hidden="hidden">
                <div class="grid-content bg-purple">
                     <el-select v-model="form.plant"  placeholder="厂房">
                        <el-option
                            v-for="item in plant"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </div>
            </el-col>
             <el-col :span="6" :hidden="!hidden" >
                <div class="grid-content bg-purple">
                     <el-select v-model="form.workshop" placeholder="车间"  >
                        <el-option
                            v-for="item in workshop"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </div>
            </el-col>
            <el-col :span="6" >
                <div class="grid-content bg-purple">
                    <el-input  
                        placeholder="请输入内容"  
                        collapse-tags
                        v-model="form.username">
                    </el-input>
                </div>
            </el-col>
            <el-col :span="6">
                <div class="grid-content bg-purple">
                    <el-button
                        type="primary"
                        style="margin-left:20px;"
                        @click="searchSubmit">
                        搜索
                    </el-button>
                </div>
            </el-col>
        </el-row>
         <el-table
            :data="tableData"
            border
            style="width: 100%"
            :hidden="hid">
            <el-table-column  
            align="center"
            prop="Id"
            label="Id">
            </el-table-column>
            <el-table-column  
            align="center"
            prop="name"
            label="用户名">
            </el-table-column>
            <el-table-column  
            align="center"
            prop="level"
            label="级别">
            </el-table-column>
            <el-table-column
             align="center"
            prop="_plant"
            label="厂房"
            v-if="!hidden">
            </el-table-column>
            <el-table-column
             align="center"
            prop="workshop"
            label="车间"
            v-if="hidden">
            </el-table-column>
             <el-table-column  
            align="center"
            prop="founder"
            label="创建者">
            </el-table-column>
             <el-table-column
              align="center"
            prop="phone"
            label="手机号">
            </el-table-column>
             <el-table-column
            label="操作"
             align="center">
                <template slot-scope="scope">
                    <el-button
                    size="mini"
                    type="danger"
                    @click="handleEdit(scope.$index, scope.row)">密码重置</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>
<script>
  import {searchUser} from '../../api/api'
  import {searchPlant} from '../../api/api'
  import { editUser } from '../../api/api';
  let data;
  export default {
    data() {
      return {
        hidden:'', 
        hid:true,
        plant:  [],
        workshop:  [{
			value: '1',
			label: '车间1'
			}, {
			value: '2',
			label: '车间2'
			}, {
			value: '3',
			label: '车间3'
        }],
        form:{
            plant:null,
            workshop:null,
            username:null
        },
        tableData: []
      }
    },
    created(){
        data = JSON.parse(sessionStorage.getItem('data'));
        this.hidden = data['level']==1?false:true;
        this.getPlant();
    },
    methods:{
        getPlant:function(){
            let username = sessionStorage.getItem('user');
            let para = {username:username};
            searchPlant(para).then(res=>{
            console.log(res);
            this.plant = [{value:null,label:'全部厂房'}]
            res.forEach(item=>{
                let obj = {};
                obj.value = item.plant;
                obj.label = `厂房${item.plant}`;
                this.plant.push(obj);
            });
            console.log(this.plant);
        })
        },
        searchSubmit:function(){
            if(this.hidden){
                this.form.plant = data['plant'];
            }else{
                this.form.workshop = null;
            }
            let form = Object.assign({}, this.form);
            searchUser(form).then(data=>{
                  this.hid = false;
                 if(data.length != 0){
                    data.forEach(item=>{
                        var num = new Array('一','二','三','四','五','六','七','八','九');
                        item.level = num[item.level-1]+"级用户";
                        if(!item.plant)
                            item._plant = `厂房${item.plant}`;
                        else
                            item._plant = "--";
                        if(!item.phone)
                            item.phone = '--'
                        if(!item.founder)
                             item.founder = '--'
                    });
                }
                this.tableData = data;
                console.log('data:',this.tableData);
            });
        },
        handleEdit:function(index, row) {
            console.log(index, row);
            this.$confirm('确认重置吗？', '提示', {}).then(() => {
                let para = {username:row.name,phone:row.phone,password:123};
                console.log(para);
                editUser(para).then((res) => {
                    let {code} = res;
                    if(code == 1){
                        this.$message({
                            message: '重置成功',
                            type: 'success'
                        });
                    }else{
                         this.$message({
                            message: '重置失败',
                            type: 'danger'
                        });
                    }
                });
			});
        }
    },
    
  }
</script>
<style lang="scss" scoped>
.search-container{
    margin:50px; 

    .el-table{
        margin-top:50px;
    }
}
</style>
